<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="static/css/base.css" />
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    <body>
        <div id="footer">
            
        </div>
        <div id="header" class="clearfix">
            <div class="fr">
                <input type="text" id="search" placeholder="Search" autocomplete="off" autofocus="off" autocorrect="off" />
            </div>
            <a href="http://facebook.com/chromeextension" target="_blank">Facebook for Chrome</a> <span class="light">&mdash;</span> <a class="light" href="https://facebook.com" target="_blank">Full Site</a>
        </div>
        <div id="sidebar">
            <ul id="nav">
                <li>
                    <a href="#home" data-tip="Newsfeed">
                        <img src="/static/img/newsfeed.png" />
                    </a>
                </li>
                <li>
                    <a href="#photos" data-tip="Photos">
                        <img src="/static/img/photos.png" />
                    </a>
                </li>
                <li>
                    <a href="#inbox" data-tip="Inbox">
                        <img src="/static/img/inbox.png" />
                    </a>
                </li>
                <li>
                    <a href="#events" data-tip="Events">
                        <img src="/static/img/events.png" />
                    </a>
                </li>
                <li>
                    <a href="#notifications" id="notifications" data-tip="Notifications">
                        <img src="/static/img/notifications.png" />
                        <div id="notification_count"></div>
                    </a>
                </li>
                <li>
                    <a href="#status" id="status" data-tip="Update Status">
                        <img src="/static/img/status.png" />
                    </a>
                </li>
                <li>
                    <a href="#help" data-tip="Settings & Help">
                        <img src="/static/img/question.png" />
                    </a>
                </li>
            </ul>
        </div>
        <div id="content"></div>
        <div id="status-popover" class="popover">
            <form method="get" action="popup.html" id="status-form">
                <div class="pm clearfix">
                    <b>Post to Facebook</b>
                </div>
                <div>
                    <textarea placeholder="What's on your mind?"></textarea>
                </div>
                <div class="tar submit">
                    <input type="reset" class="button alt small" value="Cancel" onclick="$('#status').click()" />
                    <input type="submit" class="button small" value="Post" />
                </div>
                <div class="arrow-left"></div>
                <div class="arrow-cover"></div>
            </form>
        </div>
        <div id="notifications-popover" class="popover">
            <div class="pm" style="border-bottom: 1px solid #b4bbcd;">
                <b>Notifications</b>
            </div>
            <div class="list">
            </div>
            <div class="arrow-left"></div>
            <div class="arrow-cover"></div>
        </div>
        <script type="text/javascript" src="static/js/require.js" data-main="static/js/base.js"></script>
    </body>
</html>